import { dom } from './dom.js'

export const _playBar = (list, handleClick = () => { }) => {
    // let timer
    let len = list.length
    let current = ""

    let goNext = () => {
        // if (force) return
        // timer && clearTimeout(timer)
        let index = list.findIndex(t => t.name === current.name)

        let t = index + 1 >= len ? list[0] : list[index + 1]
        handleClick && handleClick(current = t)


        // timer = setTimeout(goNext, 2000)
    }

    let goPrev = () => {
        // if (force) return
        // timer && clearTimeout(timer)
        let index = list.findIndex(t => t.name === current.name)
        let t = index - 1 < 0 ? list[len - 1] : list[index - 1]
        handleClick && handleClick(current = t)

        // timer = setTimeout(goPrev, 2000)
    }

    let handleToolbar = (e) => {
        // force = false
        let cls = e.target.className
        if (cls === 'next') {
            goNext()
        } else if (cls === 'prev') {
            goPrev()
        } else if (cls === 'stop') {
            force = true
        }

    }

    let prev = dom.div("prev", {
        class: 'prev'
    }, (e) => {
        handleToolbar(e)
    })
    let next = dom.div("next", {
        class: 'next'
    }, (e) => {
        handleToolbar(e)
    })

    // let stop = dom.div("stop", {
    //     class: 'stop'
    // }, (e) => {
    //     handleToolbar(e)
    // })

    let playBar = dom.div([prev, next], {
        class: 'toolbar'
    })

    return playBar
}